/**
 * Created by steward on 16/2/25.
 */
var data = [
    {name: "Pete Hunt"},
    {name: "Jordan James"}
];
(function(lf, r){
    var Title = r.createClass({
        render: function() {
            return (
                <div className="register-latest">
                    <div className="register-title">
                        <a className="title">{this.props.title}</a>
                    </div>
                </div>
            )
        }
    })
    var Content = r.createClass({
        render: function() {
            return (
                //<div className="register-latest">
                //    <div className="register-content">
                //        <a className="content">{this.props.name}</a>
                //    </div>
                //    <div className="divider"></div>
                //</div>
                    <li className="mui-table-view-cell">
                        <a>{this.props.name}</a>
                    </li>
            )
        }
    })
    var ContentList = r.createClass({
        render: function () {
            var nodes = this.props.data.map(function(node) {
                return (
                    <Content name={node.name}>
                    </Content>
                );
            });
            return (
                <div className="lf-list">
                    <ul className="mui-table-view">
                        {nodes}
                    </ul>
                </div>
            )
        }
    })
    var Layout = r.createClass({
        getInitialState: function() {
            return {
                data: data,
                title:'',
            };
        },
        componentDidMount: function() {
            this.setState({title: document.title})
        },
        render: function() {
            return(
                <div>
                    <Title title={this.state.title + '2人'}/>
                    <ContentList data={this.state.data}/>
                </div>
            );
        }
    });

    r.render(
      <Layout/>,
        document.getElementById('root')
    );
})(liefeng, React);